<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:co="http://xmlns.jcp.org/jsf/composite/composites"
      xmlns:ui="http://xmlns.jcp.org/jsf/facelets">
    <h:head>
        <title>login</title>
        
    </h:head>

    <h:body style="background: #eee">
        
        <f:view contracts="login">
            <ui:composition template="/template.xhtml">
                <ui:define name="top">
                    <div class="logo" >
                        <p:graphicImage value="unfiltered/images/pscLogo.png" height="100" style="width: 100%;"/>
                    </div>
                </ui:define>
                <ui:define name="content">
                    <h:form id="loginForm">
                        <p:hotkey bind="ctrl+shift+r" handler="PF('restoreDiag').show();"/>
                        <p:growl id="growl" showDetail="true" life="3000" />  
                        <p:panelGrid columns="2" >
                            <f:facet name="header">User Login</f:facet>
                            <p:outputLabel for="user" value="User Name"/>
                            <p:inputText id="user" value="#{credentials.username}" required="true" requiredMessage="User Name Can't be Empty"/>
                            <p:outputLabel for="password1" value="Password"/>
                            <p:password id="password1" value="#{credentials.password}" required="true"  requiredMessage="Enter Your Password" />

                            <f:facet name="footer">
                                <div  align="center" style="margin: 5px; ">
                                    <p:commandButton value="Login" action="#{login.login}" update="loginForm"/>
                                    
                                </div>
                            </f:facet>
                        </p:panelGrid>

                    </h:form>
                </ui:define>
            </ui:composition>
            
            <p:dialog widgetVar="restoreDiag" dynamic="true" header="Restore Application" modal="true">
                <h:form > 
                    <p:growl id="growl2" showDetail="true" life="3000" />
                   <p:panelGrid columns="2"  id="restoreCheckPanel" rendered="#{!restoreController.authtincatedRestore}">
                        <p:outputLabel value="Restore Password" for="restorePassword" />
                        <p:password id="restorePassword" required="true" value="#{restoreController.masterPassword}"/>
                        <f:facet name="footer">
                            <p:commandButton value="Check" process="@form" update="@form" action="#{restoreController.checkRestore()}" disabled="#{restoreController.attempts lt 1}"/>
                        </f:facet>
                    </p:panelGrid>
                    <p:panelGrid columns="2"  id="restorePanel" rendered="#{restoreController.authtincatedRestore}">
                        <p:outputLabel value="Restore from:" for="restoreFile" />
                        <p:fileUpload auto="true" fileUploadListener="#{restoreController.setUploadedFile}" allowTypes="/(\.|\/)(zip)$/" id="restoreFile" required="true"/>
                        <f:facet name="footer">
                            <p:fragment>
                            <p:commandButton value="restore" update="@form" action="#{restoreController.restore()}" oncomplete="PF('restoreDiag').hide();"/>
                            </p:fragment>
                        </f:facet>
                    </p:panelGrid>
                </h:form>
            </p:dialog>
        </f:view>
               <p:ajaxStatus style="width:26px;height:26px;" id="ajaxStatusPanel">  
            <f:facet name="start">  
                <h:graphicImage value="./unfiltered/images/loading.gif" width="150" height="100" style="position: absolute;left: 40%;top: 40%;z-index: 100000;"/>  
            </f:facet>  

            <f:facet name="complete">  
                <h:outputText value="" />  
            </f:facet>  
        </p:ajaxStatus>
    </h:body>
    <style>
        .container{
            background: linear-gradient(#FFFFFF, #AAD2DB) repeat scroll 0 0 #000000;
            border: 5px none;
            display: block;
            height: 75%;
            left: 25%;
            position: absolute;
            top: 12%;
            width: 50%;
        }
        .center_content{

        }
        .ui-button{
            margin-right: 1.1em;
        }

    </style>
</html>


